<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>自动跳转</title>
    <style>
        p{
            text-align: center;
        }
        span{
            color: red;
        }
    </style>
</head>
<body>
    <p>
        <span id="time">5</span> 秒后跳转到首页...
    </p>

<script>
    /*
        分析:
            显示页面效果 <p>
            倒计时读秒效果实现
                定义一个方法,获取span标签,修改span标签内容  时间--
                定义一个定时器,1秒执行一次该方法
     */
    var second = 5;
    function showTime() {
        second--;
        if (second <= 0){
            location.href = "https://www.baidu.com";
        }
        var time = document.getElementById("time");
        time.innerHTML = second + "";
    }
    setInterval(showTime,1000);
</script>

</body>
</html>